<!DOCTYPE html>
<html>
<head>
<style>
div {
 margin:0 auto;
 width: 600px;
 height: 400px;
}
table {
 border-collapse: collapse;
}
td {
 idth: 100%;
 text-align: center;
 border: 1px solid white;
}
</style>
 <script type="text/javascript"
   src="https://closure-library.googlecode.com/svn/trunk/closure/goog/base.js"></script>
 <script type="text/javascript">
  goog.require('goog.async.Delay');
 </script>
</head>
<body style="color:#fff; background-color:#000">
<div>
 <table>
  <tr><td id="a1" style="font-size:1200%;font-family:sans-seri;min-width:800px; min-height:300px">
    <span style="min-width:800px; min-height:300px">NooSphere</span></td></tr>
  <tr><td>NooSphaere </td><td>مجال_نو</td></tr>
 </table>
<script>
 //var span=document.createElement('table');
//alert("!");
  goog.require('goog.async.Delay');
  var paintThrottle=100;
  var col=0;
  function paint() {
    var hex=col.toString(16);
    if ( col<16) {
      hex="0"+hex;
    }
    document.getElementById('a1').style.backgroundColor='#'+hex+hex+hex;
    document.getElementById('a1').style.fontSize=(1200-col)+'%';
    col++;
    var delay = new goog.async.Delay(paint, paintThrottle);
    delay.start();
  };
  var delay = new goog.async.Delay(paint, paintThrottle);
  delay.start();
</script>
</div>
</body>
</html>